<template>
  <div class="set">
    <Row type="flex"
         align="middle"
         justify="center"
         class="set_ct">
      <Col>
      <Form :label-width="90"
            v-if="loaded"
            :model="formDynamic"
            :rules="ruleValidate"
            ref='formDynamic'>
        <FormItem label='前台打印：'>
          <i-switch v-model='formDynamic.frint'>
            <span slot="open">开</span>
            <span slot="close">关</span>
          </i-switch>
        </FormItem>
        <FormItem label='打印联数：'
                  prop='num1'>
          <!-- <InputNumber :max="9" :min="1" v-model="formDynamic.num1" style="width:180px"></InputNumber> -->
          <Select v-model="formDynamic.num1"
                  style="width:280px">
            <Option v-for="item in numList"
                    :value="item.value"
                    :key="item.value">{{ item.value }}</Option>
          </Select>
        </FormItem>
        <FormItem label='后台打印：'>
          <i-switch v-model='formDynamic.frintBack'>
            <span slot="open">开</span>
            <span slot="close">关</span>
          </i-switch>
        </FormItem>
        <FormItem label='打印联数：'
                  prop='num2'>
          <!-- <InputNumber :max="9" :min="1" v-model="formDynamic.num2" style="width:180px"></InputNumber> -->
          <Select v-model="formDynamic.num2"
                  style="width:280px">
            <Option v-for="item in numList"
                    :value="item.value"
                    :key="item.value">{{ item.value }}</Option>
          </Select>
        </FormItem>
        <FormItem>
          <Button type="primary"
                  @click="handleSubmit('formDynamic')"
                  class="button">确定</Button>
          <Button @click="cancel"
                  class="button btn1">取消</Button>
        </FormItem>
      </Form>
      </Col>
    </Row>
  </div>
</template>
<script>
import './index.less'
// import { routeEqual } from '@/libs/util'
import { getDicQuery, setDicSave } from '@/api/setting'
export default {
  data () {
    return {
      loaded: false,
      formDynamic: {
        frint: false,
        num1: '',
        frintBack: false,
        num2: ''
      },
      count: 0,
      subShow: false,
      ruleValidate: {
        num1: { required: true, message: '打印联数不能为空', type: 'string', trigger: 'change' },
        num2: { required: true, message: '打印联数不能为空', type: 'string', trigger: 'change' }
      },
      paramter: {
        'shopId': this.$route.query.id,
        'merchantId': this.$store.state.user.merchantId,
        'msType': '1'
      },
      numList: [{ value: '1' }, { value: '2' }, { value: '3' }, { value: '4' }, { value: '5' }, { value: '6' }, { value: '7' }, { value: '8' }, { value: '9' }]
    }
  },
  methods: {
    handleSubmit (name) {
      if (!this.formDynamic.frint && !this.formDynamic.frintBack) {
        this.$Message.error('请至少选择一种打印方式')
      }
      if (this.formDynamic.frint && !this.formDynamic.frintBack) {
        this.commonIf1()
        // console.log(this.formDynamic, '78')
        if (this.subShow) {
          // console.log(this.formDynamic, '888')
          this.save()
        }
      }
      if (this.formDynamic.frintBack && !this.formDynamic.frint) {
        this.commonIf2()
        if (this.subShow) {
          this.save()
        }
      }
      if (this.formDynamic.frintBack && this.formDynamic.frint) {
        this.commonIf1()
        this.commonIf2()
        if (this.count === 2) {
          this.save()
        } else {
          this.count = 0
        }
      }
    },
    closeModal () {
      this.$store.commit('closeTag', this.$route)
      // this.$store.commit('setTagNavList', this.$store.state.app.tagNavList.filter(item => !routeEqual(this.$route, item)))
      // this.$nextTick(() => {
      //   this.$router.push({
      //     name: 'store_setting', params: { id: this.$route.query.id }
      //   })
      // })
      if (this.$store.state.app.tagNavList[this.$store.state.app.tagNavList.length - 1].name !== 'store_setting') {
        this.$nextTick(() => {
          this.$router.push({
            name: 'store_setting', params: { id: this.$route.query.id }
          })
        })
      }
    },
    cancel () {
      this.closeModal()
      // this.$refs.formDynamic.resetFields()
      // this.formDynamic.frint = false
      // this.formDynamic.frintBack = false
    },
    commonIf1 () {
      if (this.formDynamic.num1 === 'undefined' || this.formDynamic.num1 === '0') {
        this.formDynamic.num1 = ''
      }
      this.$refs.formDynamic.validateField('num1', (valid) => {
        if (!valid) {
          this.subShow = true
          this.count += 1
        }
      })
    },
    commonIf2 () {
      if (this.formDynamic.num2 === 'undefined' || this.formDynamic.num2 === '0') {
        this.formDynamic.num2 = ''
      }
      this.$refs.formDynamic.validateField('num2', (valid) => {
        if (!valid) {
          this.subShow = true
          this.count += 1
        }
      })
    },
    save () {
      let status = Object.assign({}, this.formDynamic)
      status.frint = status.frint ? '1' : '0'
      status.frintBack = status.frintBack ? '1' : '0'
      let param = Object.assign({}, this.paramter, { 'waterBarFrontPrint': status.frint + '|' + status.num1, 'waterBarBackPrint': status.frintBack + '|' + status.num2 })
      setDicSave(param).then((res) => {
        if (res.data.status === 200) {
          this.$Message.success('设置成功!')
          this.closeModal()
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    getData () {
      let key = Object.assign({}, this.paramter, { 'dictKeys': 'waterBarFrontPrint,waterBarBackPrint' })
      getDicQuery(key).then((res) => {
        if (res.data.status === 200) {
          this.loaded = true
          res.data.data.forEach(ele => {
            for (let ind in ele) {
              if (ind === 'waterBarFrontPrint') {
                this.formDynamic.num1 = ele[ind] ? ele[ind].split('|')[1] : ''
                if (ele[ind].split('|')[0] === '1') {
                  this.formDynamic.frint = true
                } else {
                  this.formDynamic.frint = false
                }
              } else if (ind === 'waterBarBackPrint') {
                this.formDynamic.num2 = ele[ind] ? ele[ind].split('|')[1] : ''
                if (ele[ind].split('|')[0] === '1') {
                  this.formDynamic.frintBack = true
                } else {
                  this.formDynamic.frintBack = false
                }
              }
            }
          })
        } else {
          this.loaded = true
          this.$Message.error(`${res.data.error}`)
        }
      })
    }
  },
  mounted () {
    this.getData()
    if (!this.hasPermission('moms:setting:restzoneprint')) {
      this.$router.replace({ name: 'error_401' })
    }
  }
}
</script>
